<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<meta name="renderer" content="webkit">
<meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
<meta name="viewport"
	content="width=device-width, initial-scale=1, maximum-scale=1">
<link rel="stylesheet" href="static/css/style.css">
<link rel="stylesheet" href="static/css/flaticon.css">
<link rel="stylesheet" href="static/css/bootstrap-icons.css">
<link rel="stylesheet" href="static/css/tiny-slider.css">
<link rel="stylesheet" href="static/css/aos.css">
<link rel="stylesheet" href="static/css/glightbox.min.css">
<link rel="stylesheet" href="static/css/style1.css">
<link rel="stylesheet" href="static/css/flatpickr.min.css">
<link rel="stylesheet" href="../back/css/layui.css" media="all">
<link rel="short icon" href="images/28.jpg">
<title>知文招标网 - 发帖</title>

</head>
<body>
<div class="site-mobile-menu site-navbar-target">
		<div class="site-mobile-menu-header">
			<div class="site-mobile-menu-close">
				<span class="icofont-close js-menu-toggle"></span>
			</div>
		</div>
		<div class="site-mobile-menu-body"></div>
	</div>
	<nav class="site-nav">
		<div class="container"  id="chw">
			<div class="menu-bg-wrap">
				<div class="site-navigation">
					<div class="row g-0 align-items-center">
						<div class="col-2">
							<a href="index.html" class="logo m-0 float-start">知文项目管理<span
								class="text-primary">.</span></a>
						</div>
						<div class="col-8 text-center">
							<ul
								class="js-clone-nav d-none d-lg-inline-block text-start site-menu mx-auto">
								<li ><a href="index.html">首页</a></li>
								
								<li class="allPost"><a href="blog.html">全部帖子</a>
								    <!--  
									<ul class="dropdown">
										<li><a href="search-result.html">Search Result</a></li>
										<li><a href="blog.html">Blog</a></li>
										<li><a href="single.html">Blog Single</a></li>
										<li><a href="category.html">Category</a></li>
										<li><a href="about.html">About</a></li>
										<li><a href="contact.html">Contact Us</a></li>
										<li><a href="#">Menu One</a></li>
										<li><a href="#">Menu Two</a></li>
										<li class="has-children"><a href="#">Dropdown</a>
											<ul class="dropdown">
												<li><a href="#">Sub Menu One</a></li>
												<li><a href="#">Sub Menu Two</a></li>
												<li><a href="#">Sub Menu Three</a></li>
											</ul></li>
									</ul></li>
									-->
								<li><a href="category.html">所有类型</a></li>
								<li><a href="about.html">关于我们</a></li>
								<li class="active" id="toLogin1"><a href="login.html" id="toLogin">请先登录</a></li>
							</ul>
						</div>
						<div class="col-2 text-end">
							<a href="#"
								class="burger ms-auto float-end site-menu-toggle js-menu-toggle d-inline-block d-lg-none light">
								<span></span>
							</a>
								<form action="" onsubmit="return false" class="search-form d-none d-lg-inline-block">
								<input type="text" class="form-control" placeholder="搜索..." id="searchContent" @keydown.enter="search">
								<span class="bi-searchs"></span>
							</form>
						</div>
						
					</div>
				</div>
			</div>
		</div>
</nav>

	<br />
<div class="cbt"  style="margin-left:500px">
	<form class="layui-form" id="myform" style="width: 90%" onsubmit="return false">
		<div class="layui-form-item">
			<label class="layui-form-label" style="width:100px">帖子类型</label>
			<div class="layui-input-inline"  style="margin-left:10px">
				<select name="tno" id="tno" lay-verify="required" >
					<option value="">请选择帖子类型</option>
				</select>
			</div>
			<!--  
			<label class="layui-form-label">帖子名称</label>
			<div class="layui-input-inline">
				<input type="text" name="pname" lay-verify="title"
					lay-reqtext="帖子名称不能为空..." autocomplete="off" placeholder="请输入帖子名称"
					class="layui-input" style="width: 300px;">
			</div>
			-->
		</div>
		

		<div class="layui-form-item">
			<label class="layui-form-label" style="width:100px">帖子标题</label>
			<div class="layui-input-inline" style="width: 25%">
				<input type="text" name="title" lay-verify="required"
					lay-reqtext="帖子净重不能为空..." placeholder="请输入帖子标题" autocomplete="off"
					class="layui-input"  id="title" style="margin-left:10px" :value="thisPost.title">
			</div>
			<label class="layui-form-label" style="width:100px;margin-left:100px">首页图片</label>
			<div class="layui-input-inline" style="width: 200px;">
				<input type="file" name="photos" id="photos" autocomplete="off"
					onchange="setImagePreviews(this, 'showpic')" multiple="multiple" style="width:300px;margin-left:30px">
			</div>
		</div>
		<img :src="'../../' + thisPost.photo" style="margin-left: 20px;width:100px;height:100px;display:block" id="oldPhoto">
		<div class="layui-form-item" style="margin-left: 20px;" id="showpic"></div>
		<div class="layui-form-item">
			<div class="layui-inline">
				<label class="layui-form-label" style="width:100px">帖子详细</label>
				<div class="layui-input-block">
					<textarea name="goods_form_descr" id="goods_form_descr" rows="10" cols="80">{{thisPost.content}}</textarea>
				</div>
			</div>
		</div>
		<div class="layui-form-item">
			<div class="layui-input-block">
				<button type="submit" class="layui-btn" lay-submit=""
					lay-filter="demo1">立即提交</button>
				<button type="reset" class="layui-btn layui-btn-primary">重置</button>
			</div>
		</div>
	</form>
</div>
<script type="text/javascript" src="../back/js/jquery-3.4.1.min.js"></script>
<script src="js/jquery-3.6.0.js"></script>
<script src="js/vue.js"></script>
<script src="js/axios.min.js"></script>
<script type="text/javascript" src="../back/js/layui.all.js" charset="utf-8"></script>
<script type="text/javascript" src="../back/js/ajaxfileupload.js" charset="utf-8"></script>
<script type="text/javascript" src="js/show-dialog.js"></script>
<!-- <script type="text/javascript" src="../back/js/showpic.js" charset="utf-8"></script> -->
<script src="js/checkLogin.js"></script>
<script type="text/javascript" src="../back/ckeditor/ckeditor.js"></script>
<script>
$(()=>{
	if(sessionStorage.getItem("mno") == "undefined" || sessionStorage.getItem("tno") == "undefined"){
		showmsg("请先登录...","red",function(){
			location.href="login.html";
		})
	}
})

let app1 = new Vue({
	 el:'.cbt',
	 data:{
		 thisPost:[]
	 },
	 methods:{
		
	 },
	 mounted:function(){
		 if(sessionStorage.getItem("nickName") != "undefined" && sessionStorage.getItem("nickName") != null){
	 	 		$("#toLogin").html(sessionStorage.getItem("nickName"));
	 	 		$("#toLogin").attr("href","contact.html");
	 	 		$("#exitLogin").css("display","block");
	 	 }
		 
		 let params = new URLSearchParams();
		 params.append("pno",sessionStorage.getItem("pno"));
		 axios.get("../../post/thisPost",{params}).then(resp=>{
		    	this.thisPost = resp.data;
		    	this.thisPost.photo = this.thisPost.pics.split(";")[0];
		 })
	 }
})

CKEDITOR.replace('goods_form_descr');
layui.use(['form'], function(){
	var form = layui.form,
	layer = layui.layer;
  
	$.get("../../type/finds",{},rt=>{
		if(rt.code == 200){
			let str = "";
			$.each(rt.data,function(index,item){
				str += "<option value='"+ item.tno +"'>" +item.tname + "</option>";
			})
			$("#tno").append($(str));
		}
		form.render("select")
	})
	
	
	
	// 自定义验证规则
	form.verify({
    	title: function(value){
      		if(value.length < 2){
        		return '帖子名称至少得2个字符...';
      		}
    	}
	});
  
	// 监听提交
  	form.on('submit(demo1)', function(data){
  		let obj = data.field;
		let descr = CKEDITOR.instances.goods_form_descr.getData();
		obj.pno = sessionStorage.getItem("pno");
		obj.content = descr;
		$.ajaxFileUpload({
			url:"../../post/changePost",
			secureuri:false,
			fileElementId:"photos",
			data:obj,
			dataType:"json",
			success:function(rt,status){
				if(rt.code == 511){
					layer.msg("输入信息不完整,请确认后提交...");
					return false;
				}
				
				if(rt.code == 700){
					showmsg("请先登录...","red",function(){
						location.href="login.html";
					})
				}
				
				if(rt.code == 200){
					$("#myform")[0].reset();   //重置表单
					$("#showpic").html("");  //清空图片预览
					CKEDITOR.instances.goods_form_descr.setData("");
					layui.form.render();
					layer.msg("修改成功...",{icon:1,time:2000});
					return false;
				}
				layer.msg("修改失败...",{icon:2,time:2000});
			},
			error:function(rt,status,e){
				console.log(data)
				layer.msg("修改失败\n" + e,{icon:2,time:2000})
			}
		})
		
		return false;
	});
});

function setImagePreviews(imagesObj,divid) {
	$("#oldPhoto").css("display","none");
    var dd = document.getElementById(divid);
    dd.style.display="block";
    dd.innerHTML = "";
    var fileList = imagesObj.files;
    for (var i = 0; i < fileList.length; i++) {            
        dd.innerHTML += "<div style='float:left;border:2px solid #95B8E7;margin-right:10px;margin-bottom:10px' > <img id='"+divid+"_img" + i + "'  /> </div>";
        var imgObjPreview = document.getElementById(divid+"_img"+i); 
        if (imagesObj.files && imagesObj.files[i]) {
            //火狐下，直接设img属性
            imgObjPreview.style.display = 'block';
            imgObjPreview.style.width = '100px';
            imgObjPreview.style.height = '100px';
            imgObjPreview.src = window.URL.createObjectURL(imagesObj.files[i]);
        }else {
            //IE下，使用滤镜
            imagesObj.select();
            var imgSrc = document.selection.createRange().text; //运用IE滤镜获取数据;
            //alert(imgSrc);
            var localImagId = document.getElementById("img" + i);
            //必须设置初始大小
            localImagId.style.width = "100px";
            localImagId.style.height = "100px";
            //图片异常的捕捉
            try {
                localImagId.style.filter = "progid:DXImageTransform.Microsoft.AlphaImageLoader( true,sizingMethod=scale,src = imgSrc)";  //scale：缩放图片以适应对象的尺寸边界。
            }
            catch (e) {
                alert("您上传的图片格式不正确，请重新选择!");
                return false;
            }
            imgObjPreview.style.display = 'none';
            document.selection.empty(); //在当前网页下不能选择对象,也就是鼠标不能选中 
        }
    }  
    return true;
}
</script>
</body>
</html>